<template>
  <section class='f-earning-detail'>
    <div class="f-flex-between" style="color:#666666;padding:14px 16px 10px 13px;font-size:11px">
      <p>订单编号：{{formData.incomeOrderId}}</p>
      <p>{{ getDateTime(formData.createTime)[6] }}</p>
    </div>
    <van-cell title="订单类型">
      <template #value>
        <p :style="{'color': formData.incomeType == 2? 'red': '#424242'}">{{formData.incomeType == 1? '佣金收益': '佣金核减'}}</p>
      </template>
    </van-cell>
    <van-cell :title="formData.incomeType == 1? '佣金收益': '佣金核减'">
      <template #value>
        <p>{{ toThousands(formData.income) }}</p>
      </template>
    </van-cell>

    <van-cell class="f-mt-15" title="激活号码" :value="formData.phone" />

    <van-cell class="f-mt-15" title="供应商" :value="formData.supplierShopName" />
    <van-cell title="关联商品" :value="formData.goodsName" />
    <van-cell title="备注信息" :value="formData.remarks" />

    <van-cell v-if="formData.auditOrderId" class="f-mt-15" title="关联审核订单" is-link @click="toUploadDetail(formData.auditOrderId)">
      <template #value>
        <p style="color:#3273F4">{{formData.auditOrderId || '--'}}</p>
      </template>
    </van-cell>
  </section>
</template>
<script>
import { ref, reactive, toRefs, onMounted, watch } from 'vue';
import { useRouter, useRoute } from 'vue-router'
import { useStore } from 'vuex';
import api from '../api'
import { toThousands, getDateTime } from '@/utils/utils';

export default {
  setup(props, context) {
    const store = useStore()

    const router = useRouter()
    const route = useRoute();

    const state = reactive({
      formData: {}
    })

    onMounted(() => {
      store.commit("setNavBar", {
        title: '收益详情',
        show: true,
        left: true,
        leftType: 'back',
        right: false,
        rightType: 'search',
        path: '/index/uploadData'
      });

      state.incomeOrderId = route.query.incomeOrderId
      getInDetail(state.incomeOrderId)
    })

    const getInDetail = (incomeOrderId) => {
      let json = {
        incomeOrderId
      }
      api.inDetail(json).then(res => {
        state.formData = res.data
      })
    }


    const toUploadDetail = (orderId) => {
      router.push({
        path: '/index/uploadDetail',
        query: {
          orderId: orderId,
        }
      })
      return
      if (route.query.pathName) {
        router.replace({
          path: '/middle',
          query: {
            orderId: orderId,
            pathName: '/index/uploadDetail'
          }
        })
      } else {
        router.push({
          path: '/middle',
          query: {
            orderId: orderId,
            pathName: '/index/uploadDetail'
          }
        })
      }
    }

    return {
      ...toRefs(state),
      toThousands,
      getDateTime,
      toUploadDetail
    }
  }
}
</script>
<style lang='scss'>
.f-earning-detail {
  .van-cell__value {
    min-width: 55%;
  }
}
</style>